* {
	margin: 0;
	padding: 0;
	border: 0;
}

body,
html {
	width: 100%;
	height: 100%;
}

.header {
	width: 100%;
	height: 10%;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 200;
}


/*--------导航栏左侧logo大小 位置控制*/

.logo {
	width: 10%;
	height: 45%;
	position: absolute;
	left: 10%;
	top: 20%;
}

.logo>img {
	width: 100%;
	height: 100%;
}


/*-------------- 导航栏超链接外形控制---------------------*/

.header_right {
	width: 50%;
	height: 100%;
	position: absolute;
	left: 40%;
	overflow: hidden;
}

.first {
	width: 10%;
	height: 100%;
	float: left;
	margin-left: 5%;
	font-size: 20px;
	text-align: center;
	line-height: 80px;
	border: 1px solid skyblue;
	border-radius: 10px;
	background-color: skyblue;
}

.product {
	width: 10%;
	height: 100%;
	float: left;
	margin-left: 5%;
	font-size: 20px;
	text-align: center;
	line-height: 80px;
	border-radius: 10px;
	transition: all .2s;
}

.trends {
	width: 10%;
	height: 100%;
	float: left;
	margin-left: 5%;
	font-size: 20px;
	text-align: center;
	line-height: 80px;
	border-radius: 10px;
	transition: all .2s;
}

.about {
	width: 10%;
	height: 100%;
	float: left;
	margin-left: 5%;
	font-size: 20px;
	text-align: center;
	line-height: 80px;
	border-radius: 10px;
	transition: all .2s;
}

.Login {
	width: 10%;
	height: 100%;
	float: left;
	margin-left: 5%;
	font-size: 20px;
	text-align: center;
	line-height: 80px;
	border-radius: 10px;
	transition: all .2s;
}


/*----------------------导航栏的特效--------------------*/

.product:hover {
	background-color: deeppink;
}

.trends:hover {
	background-color: deeppink;
}

.about:hover {
	background-color: deeppink;
}

.Login:hover {
	background-color: deeppink;
}


/*-----------超链接去掉下划线 变色--------*/

.first>a {
	text-decoration: none;
	color: white;
}

.product>a {
	text-decoration: none;
	color: white;
}

.trends>a {
	text-decoration: none;
	color: white;
}

.about>a {
	text-decoration: none;
	color: white;
}

.Login>a {
	text-decoration: none;
	color: white;
}


/*-----------总体flash----------------*/

.swiper-container {
	width: 100%;
	height: 500px;
	position: relative;
}


/*-------移动匡*/

.swiper-wrapper {
	width: 100%;
	height: 1500px;
	position: absolute;
}


/*--------------第一个flash -------------------*/

.swiper-slide {
	width: 100%;
	height: 500px;
	overflow: hidden;
	position: relative;
}


/*右边手机*/

.phone {
	width: 20%;
	height: 85%;
	position: absolute;
	top: 30%;
	left: 25%;
	background-image: url(../img/web_banner_iphone.png);
	background-size: 100% 100%;
}


/*右边文字*/

.text {
	width: 10%;
	height: 30%;
	background-image: url(../img/web_banner_character.png);
	background-size: 100% 100%;
	position: absolute;
	top: 35%;
	left: 47%;
}


/*右边超链接*/

.text_a {
	width: 10%;
	position: absolute;
	top: 75%;
	left: 47%;
	border-radius: 10px;
	background-color: deepskyblue;
	text-align: center;
}

.text_a>a {
	font-size: 20px;
	line-height: 50px;
	text-decoration: none;
	color: white;
}


/*-------------------第二个flash---------------------*/

.swiper-slide {
	width: 100%;
	height: 500px;
	overflow: hidden;
}


/*左边列表*/

.list {
	width: 20%;
	height: 60%;
	top: 50%;
	left: 25%;
	position: absolute;
	background-image: url(../img/cusflo_banner_interface-2.png);
	background-size: 100% 100%;
}


/*右边文字*/

.userPicture {
	width: 10%;
	height: 30%;
	top: 40%;
	left: 50%;
	position: absolute;
	background-image: url(../img/cusflo_banner_character-1.png);
	background-size: 100% 100%;
}


/*右边超链接*/

.pic_a {
	width: 10%;
	top: 80%;
	left: 50%;
	position: absolute;
	background-color: deepskyblue;
	text-align: center;
	border-radius: 10px;
	position: absolute;
}

.pic_a>a {
	font-size: 20px;
	line-height: 50px;
	text-decoration: none;
	color: white;
}


/*---------------第三个-------------*/

.swiper-slide {
	width: 100%;
	height: 500px;
	overflow: hidden;
}

.zhf {
	width: 20%;
	height: 60%;
	top: 30%;
	left: 25%;
	position: absolute;
	background-image: url(../img/cusflo_banner_interface-1.png);
	background-size: 100% 100%;
}


/*--------------轮播图下面的三张大图--------------------*/

.bg1 {
	width: 100%;
	height: 50%;
	background: url(../img/1.jpg) 100% 100% fixed no-repeat;
	position: relative;
	background-size: cover;
}

.bg2 {
	width: 100%;
	height: 50%;
	background: url(../img/2.jpg) 100% 100% fixed no-repeat;
	position: relative;
	background-size: cover;
}

.bg3 {
	width: 100%;
	height: 50%;
	background: url(../img/3.jpg) 100% 100% fixed no-repeat;
	position: relative;
	background-size: cover;
}

.bg4 {
	width: 100%;
	height: 50%;
	background: url(../img/4.jpg) 100% 100% fixed no-repeat;
	position: relative;
	background-size: cover;
}


/*------------------------带有生意字样的div---------------------------*/

.Business {
	width: 100%;
	height: 250px;
	z-index: 99;
	position: relative;
}

.Business>img {
	width: 100%;
	height: 100%;
}


/*让了解更轻松div*/

.pic {
	width: 100%;
	height: 200px;
	z-index: 99;
	position: relative;
}


/*带电脑的div*/

.com {
	width: 100%;
	height: 200px;
	z-index: 99;
	position: relative;
}


/*带手机的*/

.iphone {
	width: 100%;
	height: 200px;
	z-index: 99;
	position: relative;
}


/*带地图的*/

.map {
	width: 100%;
	height: 200px;
	z-index: 99;
	position: relative;
}


/*带有画布字样div内含图片*/

.IMg {
	width: 30%;
	height: 140%;
	position: absolute;
	top: -40%;
	left: 20%;
}

.IMg>img {
	width: 100%;
	height: 100%;
}

.Text {
	width: 25%;
	height: 100%;
	position: absolute;
	left: 50%;
}

.Text>img {
	width: 100%;
	height: 100%;
}


/*带电脑的div*/

.TheText {
	width: 30%;
	height: 100%;
	margin-left: 10%;
}

.TheText>img {
	width: 100%;
	height: 100%;
}

.TheIMg {
	width: 20%;
	height: 120%;
	position: absolute;
	top: -20%;
	left: 50%;
}

.TheIMg>img {
	width: 100%;
	height: 100%;
}


/*带手机的div*/

.Bigphone {
	width: 10%;
	height: 180%;
	position: absolute;
	top: -40%;
	left: 25%;
}

.Bigphone>img {
	width: 100%;
	height: 100%;
}

.BigText {
	width: 30%;
	height: 70%;
	position: absolute;
	top: 10%;
	left: 40%;
}

.BigText>img {
	width: 100%;
	height: 100%;
}


/*带地图的*/

.SmallText {
	width: 30%;
	height: 80%;
	position: absolute;
	top: 10%;
	left: 20%;
}

.SmallText>img {
	width: 100%;
	height: 100%;
}

.TheMap {
	width: 20%;
	height: 70%;
	position: absolute;
	top: 10%;
	left: 55%;
}

.TheMap>img {
	width: 100%;
	height: 100%;
}


/*最后一个div */

.bottom {
	width: 100%;
	height: 10%;
	background-color: black;
	opacity: 0.8;
}

.a1 {
	color: white;
	font-size: 16px;
	text-align: center;
}

.a2 {
	color: white;
	font-size: 16px;
	text-align: center;
}